<!--  -->
<template>
  <div class="user">
    <div class="allone">
      <div class="more">
        <div style="margin-left: 19px"><strong>园区动态</strong></div>
        <div style="text-align: right;margin-right:27px color: #006EFF;">查看更多 &gt;</div>
      </div>
      <ul>
        <li v-for="te in text" :key="te.id">
          <img
            src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
            alt=""
            class="imgs"
          />
          <div class="sname">
            <p class="zhan">
              <span>{{ te.txto }} </span><span>{{ te.txtt }}</span
              ><span>{{ te.txtr }}</span>
            </p>
            <span class="xia">{{ te.times }}</span>
          </div>
        <!-- <i class="listys"></i> -->
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      text: [
        {
          txto: '综合招商小组 ',
          txtt: '跟进项目',
          txtr: '项目名称',
          times: '2 分钟前',
        },
        {
          txto: '工业园区招商小组  ',
          txtt: '新建一个包装项目',
          txtr: '',
          times: '3 天前',
        },
        {
          txto: '工业园区招商小组  ',
          txtt: '新建一个包装项目',
          txtr: '',
          times: '3 天前',
        },
      ],
    }
  },
  created() {},
  methods: {},
  beforeDestroy() {},
}
</script>

<style lang='scss' scoped>
.user {
  display: flex;
  flex-grow: 1;
  width: 100%;
  height: 333px;
  background: #fff;
  .allone {
    flex-grow: 1;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    .more {
      flex-grow: 1;
      width: 100%;
      display: flex;
      justify-content: space-between;
      height: 55px;
      border-bottom: 1px solid rgb(213, 211, 211);
      align-items: center;
      div {
        margin: auto 0;
        width: 50%;
        height: 29px;
        font-size: 16px;
        font-family: PingFangSC, PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        color: rgba(0, 0, 0, 0.85);
        line-height: 29px;
      }
      div:nth-child(2) {
        margin-right: 29px;
      }
    }
    ul {
      margin: 0;
      padding: 0;
      display: flex;
      width: 100%;
      justify-content: center;
      height: auto;
      align-items: center;
      flex-wrap: wrap;
      li {
        width: 95%;
        height: 85px;
        display: flex;
       border-bottom:1px solid   #E9E9E9;
        margin-top: 10px;
        .imgs {
          display: block;
          width: 32px;
          height: 32px;
          border-radius: 32px 32px;
          display: flex;
          flex-wrap: wrap;
        }
        // .listys{
        //   margin-top: 30px;
        //   width: 100%;
        //   display: block;
        //   height: 1px;
        //   background: #E9E9E9;
        // }
        .sname {
          margin: 0px 0 0 10px;
          width: 400px;
          height: 85px;
          display: flex;
          flex-wrap: wrap;
          .zhan {
            margin-bottom: 0px;
            height:auto;
            display: flex;
            width: 100%;
            font-size: 14px;
            font-family: PingFangSC, PingFangSC-Regular;
            font-weight: 400;
            span:nth-child(1) {
              display: block;
              color: #1890ff;
              margin-right: 8px;
            }
            span:nth-child(2) {
              display: block;
              color: #0f0f0f;
              margin-right: 8px;
            }
            span:nth-child(3) {
              display: block;
              color: #1890ff;
            }
          }
          .xia {
            width: 56px;
            display: block;
            color: rgba(0, 0, 0, 0.45);
            font-weight: 400;
            height: 17px;
            line-height: 17px;
          }
        }
      }
    }
  }
}
</style>
